<%--
Created by IntelliJ IDEA.
User: Animo
Date: 2017-12-21
Time: 10:05
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
</head>
<body>
<table class="layui-hide" id="test" lay-filter="demo"></table>


<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>


</body>
<script src="/static/layui/layui.all.js"></script>
<script>
    layui.use([ 'laypage', 'layer', 'table', 'element'], function(){
        var laypage = layui.laypage //分页
        layer = layui.layer //弹层
            ,table = layui.table //表格
            ,element = layui.element; //元素操作
        //执行一个 table 实例
        table.render({
            elem: '#test'
            ,height: 332
            ,url: '/rewardset/data/json/pager' //数据接口
            ,page: true //开启分页
            ,limit:10//每页显示多少个
            //后台Pager响应对象 不要动
            ,response: {
                statusName: 'status'
                ,statusCode: 0
                ,msgName: 'message'
                ,countName: 'total'
                ,dataName: 'rows'
            }
            //后台Pager响应对象 不要动
            //表头
            ,cols: [[
                {field: 'uname', title: '用户姓名', width:150, sort: true, fixed: 'left'}
                ,{field: 'phone', title: '手机号',width:150, align:'center'}
                ,{field: 'tmoney', title: '总投资',width:150, align:'center'}
                ,{field: 'money', title: '奖励金额',width:150, align:'center'}
                ,{field: 'rewardTime', title: '发放时间',width:250, align:'center'}
                ,{field: 'status', title: '状态',width:150, align:'center',templet:'<div>{{status(d.status)}}</div>'}
            ]]
            //表头
        });

        //监听工具条
        table.on('tool(demo)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
                ,layEvent = obj.event; //获得 lay-event 对应的值
            if(layEvent === 'detail'){
                layer.msg('查看操作');
            } else if(layEvent === 'del'){
                layer.confirm('真的删除行么', function(index){
                    obj.del(); //删除对应行（tr）的DOM结构
                    layer.close(index);
                    //向服务端发送删除指令
                });
            } else if(layEvent === 'edit'){
                layer.msg('编辑操作');
            }
        });
    });
    function status(value) {
        if(value==0){
            return"未发放";
        }else{
            return "已发放";
        }
    }
</script>
</html>
